<!--
- Author:   .
- Date:    2017/7/14 0014.
- File:    add.
-->
<template>
  <div>
    <div class="Web_Box nb bg_fff pb86">
      <div class="Evaluate" v-for="item in orderInfo.order_info.extend_order_goods">
        <div class="ProList">
          <ul>
            <li>
              <div class="Pic"><img :src="$config.website + $config.goodsImgSrc + item.goods_image" alt=""></div>
              <div class="Con">
                <div class="fl">
                  <h2 class="slh2">{{item.goods_name}}</h2>
                  <p class="Attributes slh mb10"><span v-for="attr in item.goods_spec">{{attr.name}} </span></p>
                </div>
                <div class="fr tr"><span class="Prices">￥{{item.goods_price}}</span>
                  <span class="Num">×{{item.goods_num}}</span></div>
                <!--<p class="Total tr">共{{item.goods_num}}件商品  合计：￥112.00</p>-->
              </div>
            </li>
          </ul>
        </div>
        <div class="score mt20">
          <div class="tit">商品评分</div>
          <div class="con">
            <i class="iconfont" :class="{'icon-star': item.comment.star < 1 , 'icon-staron': item.comment.star >= 1}" @click="setStar(item, 1)"></i>
            <i class="iconfont" :class="{'icon-star': item.comment.star < 2 , 'icon-staron': item.comment.star >= 2}" @click="setStar(item, 2)"></i>
            <i class="iconfont" :class="{'icon-star': item.comment.star < 3 , 'icon-staron': item.comment.star >= 3}" @click="setStar(item, 3)"></i>
            <i class="iconfont" :class="{'icon-star': item.comment.star < 4 , 'icon-staron': item.comment.star >= 4}" @click="setStar(item, 4)"></i>
            <i class="iconfont" :class="{'icon-star': item.comment.star < 5 , 'icon-staron': item.comment.star >= 5}" @click="setStar(item, 5)"></i>
          </div>
        </div>
        <div class="EvaluationText bor_b_dcdddd">
          <textarea placeholder="评价内容..." v-model="item.comment.content"></textarea>
        </div>
      </div>
    </div>
    <div class="BottomGd">
      <button class="but_2 wauto" type="button" @click="submitCommentList">发表评论</button>
    </div>
    <back-nav></back-nav>
  </div>
</template>

<script>
  export default{
    data() {
      return {
        orderId: this.$route.params.id,
        orderInfo: {add_list: {}, order_info: {extend_order_common: {}, extend_order_goods: {}}}
      }
    },
    components: {},
    created() {
      this.getOrderInfo(this.orderId)
    },
    methods: {
      getOrderInfo(id) {
        this.$request.getOrderInfo(id).then(data => {
          for (let i = 0; i < data.order_info.extend_order_goods.length; i++) {
            data.order_info.extend_order_goods[i].comment = {content: '', star: 5}
          }
          this.orderInfo = data
        }).catch(e => {
          this.$toast('获取订单信息失败：' + e.msg)
        })
      },
      setStar(goods, num) {
        goods.comment.star = num
      },
      submitCommentList() {
        let commentList = []
        for (let i = 0; i < this.orderInfo.order_info.extend_order_goods.length; i++) {
          commentList.push(this.orderInfo.order_info.extend_order_goods[i].comment)
        }
        this.$request.addCommentList(commentList, this.orderId).then(data => {
          this.$toast('提交评论成功')
          this.$router.go(-1)
        }).catch(e => {
          this.$toast('提交评论失败：' + e.msg)
        })
      }
    }
  }
</script>

<style>

</style>